<template>
	<view class="list-content">
		<view class="list-item" v-for="(item,index) in list" :key="index">
			<view class="list-item-course">
				<view class="list-item-course_detail">
					<!-- +'?imageView2/2/w/100/h/100/q/85' -->
					<image :src="item.img" mode="aspectFit"></image>
					<view>
						<view class="list-item-course_detail_title text_black">{{item.course_title}}</view>
						<view class="list-item-course_detail_tips text_opblack">奥北体能</view>
					</view>
				</view>
				<view class="list-item-course_price text_black">{{item.price}}元</view>
			</view>
			<view class="list-item-order">
				<view>
					<view class="list-item-order_item">
						<text class="text_black">订单编号</text>
						<text class="text_opblack">{{item.order_num}}</text>
					</view>
					<view class="list-item-order_item">
						<text class="text_black">下单时间</text>
						<text class="text_opblack">{{item.order_created}}</text>
					</view>
				</view>
				<view class="list-item-order_button" :class="'button'+item.status" @click="itemDetail(item)">
					<text v-if="item.status==1">已取消</text>
					<text v-if="item.status==2">去支付</text>
					<text v-if="item.status==3">详情</text>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
					status:1,
					price:"128",
					content: "<p><b>练习目的：</b>该练习主要发展儿童肢体协调性。</p><p><b>练习要点：</b>练习过程中采用六点支撑，两侧膝盖和脚应该与髋同宽，双手与肩同宽，手膝依次交替向前爬行。</p>",
					course_id: "272",
					course_title: "爬行",
					img: "https://qiniu.aobeitineng.com/1687535601878手膝爬行.mp4?vframe/jpg/offset/1",
					is_free: "1",
					lesson_id: "1603",
					lesson_title: "手膝爬行",
					studies: "47",
					title: "练习方案",
					video_size: "",
					video_time: "18",
					order_num:'aobei12321423423423423',
					order_created:'2023.11.20 13:30:32',
					video_url: "https://qiniu.aobeitineng.com/1687535601878手膝爬行.mp4",
				}, {
					status:2,
					price:"128",
					content: "<p><b>练习目的：</b>该练习主要发展儿童肢体协调性。</p><p><b>练习要点：</b>练习过程中采用六点支撑，两侧膝盖和脚应该与髋同宽，双手与肩同宽，手膝依次交替向前爬行。</p>",
					course_id: "272",
					course_title: "爬行",
					img: "https://qiniu.aobeitineng.com/1687535601878手膝爬行.mp4?vframe/jpg/offset/1",
					is_free: "1",
					lesson_id: "1603",
					lesson_title: "手膝爬行",
					studies: "47",
					title: "练习方案",
					video_size: "",
					video_time: "18",
					order_num:'aobei12321423423423423',
					order_created:'2023.11.20 13:30:32',
					video_url: "https://qiniu.aobeitineng.com/1687535601878手膝爬行.mp4",
				},{
					status:3,
					price:"128",
					content: "<p><b>练习目的：</b>该练习主要发展儿童肢体协调性。</p><p><b>练习要点：</b>练习过程中采用六点支撑，两侧膝盖和脚应该与髋同宽，双手与肩同宽，手膝依次交替向前爬行。</p>",
					course_id: "272",
					course_title: "爬行",
					img: "https://qiniu.aobeitineng.com/1687535601878手膝爬行.mp4?vframe/jpg/offset/1",
					is_free: "1",
					lesson_id: "1603",
					lesson_title: "手膝爬行",
					studies: "47",
					title: "练习方案",
					video_size: "",
					video_time: "18",
					order_num:'aobei12321423423423423',
					order_created:'2023.11.20 13:30:32',
					video_url: "https://qiniu.aobeitineng.com/1687535601878手膝爬行.mp4",
				}, ]
			}
		},
		onLoad() {

		},
		methods: {
			//详情
			itemDetail(item){
				if(item.status==1){
					// 取消按钮
					
				}else if(item.status==2){
					// 去支付
					uni.navigateTo({
						url:'/pages/payment/index'
					})
				}else if(item.status==3){
					// 查看详情
					uni.navigateTo({
						url:'/pages/payment/listdetails'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url("./list.scss");
	.text_black {
		color: $uni-text-color-black !important;
	}
	
	.text_opblack {
		color: $uni-text-color-opblack !important;
	}
	
	.text_active{
		color: $uni-color-primary!important;
	}
	.button1{
		background-color: #7A7A7A;
	}
	.button2{
		background-color: #FF6E00;
	}
	.button3{
		background-color: #FF6E00;
	}
</style>